<template>
  <div class="dashboard">
    <!-- 日历 心情卡片 -->
    <div class="box1">
      <calendarView class="calendar"></calendarView>
      <!-- <moodCard class="mood"></moodCard> -->
    </div>
    <!-- todolist部分 -->
    <div class="box2">
      <todoList></todoList>
    </div>
    <!-- 个人信息卡部分 -->
    <div class="box3">
      <userInfo></userInfo>
    </div>
  </div>
</template>
<script>
// import moodCard from '@/components/dashboard/moodCard.vue'
import todoList from '@/components/dashboard/todoList.vue'
import userInfo from '@/components/dashboard/userInfo.vue'
import calendarView from '@/components/dashboard/calendarView.vue'
export default {
  data () {
    return {
    }
  },
  components: {
    // moodCard,
    todoList,
    userInfo,
    calendarView
  },
  created () {

  },
  methods: {

  }
}
</script>
<style lang="less" scoped>
.dashboard {
  display: flex;
  justify-content: center;
  .box1{
    width: 300px;
    display: flex;
    flex-direction: column;
    .calendar{
      flex: 1;
    }
    .mood{
      height: 315px;
    }

  }
  .box2{
    flex: 1;
  }
  .box3{
    width: 300px;
  }
}

</style>
